import React, { Component } from 'react';

import './index.scss';

export default class TableBody extends Component {

	render () {
    
    const { sliderData, onStatusClick } = this.props;

		return (
      <tbody>
      	{
      		sliderData.map((item, index) => {
            return (
              <tr key={ index }>
              	<td>{ item.cid }</td>
              
              	<td className="slider-img-wrap">
					<img 
					className="slider-img"
					src={ `http://gcimg.mvvm.xyz/${item.imgKey}` }
					alt={ item.title } />
              	</td>
              	<td className="course-name">
              		{ item.title }
              	</td>
              	<td>
              		<button 
                     className={ ['btn', item.status ? 'btn-danger' : 'btn-success'].join(' ') }
                     onClick={ () => onStatusClick(item.id, index) }
                    >
              		  { item.status ? '下架' : '上架' }
              		</button>
              	</td>
              </tr>
            );
      		})
      	}
      </tbody>
		);
	}
}